<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>二维码管理</title>
    <meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
    <meta name="description" content="H+是一个完全响应式，基于Bootstrap3最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术">
<link href="<%=path %>/hplus/css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
<link href="<%=path %>/hplus/css/plugins/iCheck/custom.css" rel="stylesheet">
<link href="<%=path %>/hplus/css/animate.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.16/css/jquery.dataTables.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/gh/bootcdn/BootCDN/ajax/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"><link rel="stylesheet" type="text/css" href="<%=path%>/hplus/css/font-awesome.min93e3.css?v=4.4.0"/>
<link rel="stylesheet" type="text/css" href="<%=path%>/hplus/css/plugins/datapicker/datepicker3.css">
<link rel="stylesheet" type="text/css" href="<%=path%>/hplus/css/plugins/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css">
<link rel="stylesheet" type="text/css" href="<%=path%>/hplus/css/style.min.css"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.16/css/jquery.dataTables.min.css" rel="stylesheet">
    <style>
        .col-sm-1{
            padding-right: 0;
        }
		JSON
		body {font-size: 14px;padding: 20px;}
		.radio-primary input[type="radio"] + label::after {background-color: #1ab394;}
		.radio-primary input[type="radio"]:checked + label::after {background-color: #1ab394;}
		.radio-primary input[type="radio"]:checked + label::before {border-color: #1ab394;}
		form>div.row{margin-bottom: 16px;}
		a.btn-rounded{margin-right: 16px;}
    </style>
</head>

<body class="gray-bg">
    <div class="wrapper wrapper-content">
		<div class="tabs-container">
			     <ul class=" nav nav-tabs">
			      <shiro:hasPermission name="scrm_qrcode_markting_create">
			                <li class="active"><a data-toggle="tab" href="#tab-1" aria-expanded="true">创建</a>
			                </li>
			      </shiro:hasPermission>
			      <shiro:hasPermission name="scrm_qrcode_markting_mamage">
			                <li class=""><a data-toggle="tab" href="#tab-2" aria-expanded="false" onclick="init_tables()">管理</a>
			                </li>
			      </shiro:hasPermission>
			     </ul>
		     <div class="tab-content">		     
					<div class="ibox-content tab-pane active" id="tab-1">
					
						<div class="row" style="height:20px;">							
						</div>
						<div class="row">
					     	<div class="form-group">
					     		<label class="col-sm-1 control-label" style="min-width:150px;">二维码类型</label>
					     		<div class="col-sm-1" style="margin-top: -10px;" >
					            	<div class="radio radio-primary">
					                <input id="link" type="radio" name="code_type" checked="checked" value="0" >
					                <label for="link" style="min-width:150px;">自定义链接</label>
			            			</div>
			            		</div>
			            		<div class="col-sm-1"  style="margin-top: -10px;">
					            	<div class="radio radio-primary">
					                <input id="activity" type="radio" name="code_type" value="1">
					                <label for="activity">H5活动</label>
			            			</div>
			       				 </div>		     	
				     		</div>
				     		
			     		</div>
				     	 <div class="row" style="margin-top:10px; display:none;" id="show_activity">
					     		<div class="form-group">
						     		<label class="col-sm-1 control-label" style="margin-top:10px;min-width:150px;">选择活动</label>
						     		<div class="form-group col-sm-3">
						     			<input id="activity_url" style="display:none;"/>
						 			    <input class="form-group form-control" id="activity_name" style="min-width: 100px;" placeholder="点击选择活动"/>							  	
									</div>			
						     	</div>
				     	 </div>
				     	 <div class="row" style="margin-top:10px;" id="show_linkUrl">
					     		<div class="form-group">
						     		<label class="col-sm-1 control-label" style="margin-top:10px;min-width:150px;">输入链接地址</label>
						     		<div class="form-group col-sm-3">
						 			    <input class="form-group form-control" id="link_url" style="min-width: 100px;" placeholder="请输入链接地址"/>							  	
									</div>			
						     	</div>
				     	 </div>
				     	 <div class="row">
				     	 	<div class="form-group">
						     		<label class="col-sm-1 control-label" style="margin-top:10px;min-width:150px;">选择门店</label>
						     			<input id="store_id" type="text" style="display:none;"/>
						     		<div class="form-group col-sm-3">
						 			    <input class="form-group form-control" id="store_name" autocomplete="off" data-provide="typeahead" style="min-width: 100px;" placeholder="请输入门店名称"/>							  	
									</div>			
						     	</div>
				     	 </div>
				     	 <div class="row">
				     	 	<div class="form-group">
						     		<label class="col-sm-1 control-label" style="margin-top:10px;min-width:150px;">绑定员工或渠道</label>
						     		<div class="form-group col-sm-1">
						 			    <select class="form-group form-control" id="bind_type" style="min-width:120px;">
<!-- 											<option value="0">不做绑定</option>
 -->											<option value="1">绑定渠道</option>
											<option value="2">绑定员工</option>
									   </select>					  	
									</div>
									<div class="form-group col-sm-1" style="max-width:20px;"></div>	
									<div class="form-group col-sm-7" id="channel">
										<label class="col-sm-1 control-label" style="margin-top:10px;min-width:100px;">自定义渠道</label>
										<div class="form-group col-sm-3">
						 			    <input class="form-group form-control" id="channel_info" style="min-width: 100px;"/>							  	
										</div>
									</div>	
									<div class="form-group col-sm-7" id="user" style="display:none;">
										<div class="col-sm-2" >
							            	<div class="radio radio-primary">
							                <input id="all_user" type="radio" name="bind_info" value="0" checked="checked" >
							                <label for="all_user">全部员工批量生成</label>
					            			</div>
					            		</div>
					            		<div class="col-sm-2" >
							            	<div class="radio radio-primary">
							                <input id="one_user" type="radio" name="bind_info" value="1">
							                <label for="one_user">指定员工</label>
					            			</div>
					       				 </div>	
										<div class="form-group col-sm-3">
											<input id="user_id" style="display:none;"/>
							 			    <input class="form-group form-control" id="user_name" style="min-width: 100px; display:none;" placeholder="请输入员工姓名"/>							  	
										</div>
									</div>	
				     	 </div>
					 </div>
					 <div class="row">
					 	<div class="col-sm-4"></div>
					 		<div class="form-group">
		                    <div class="col-sm-3 col-sm-offset-1">            
		                    	<button type="button" class=" btn btn-outline btn-primary col-sm-4" id="close" style="margin-right:20px;">取消</button>   
		                    	&nbsp;&nbsp;&nbsp;&nbsp;     
		                    	<shiro:hasPermission name="qrcode_markting_create:create">    
								<button type="button" class=" btn btn-primary k_verify col-sm-4" id="commit">创建</button>
								</shiro:hasPermission>
							</div>
					 	</div>
					 </div>
					</div> 
					<div class="ibox-content tab-pane " id="tab-2">
						<div class="row" style="height:20px;">							
							</div>
						<div class="row">
					     	<div class="form-group">
					     		<label class="col-sm-1 control-label"style="    line-height: 35px;margin-left: 10px;" >时间筛选</label>
					     		<div class="btn-group col-sm-2">
		                            <button class="btn btn-primary" id="day" type="button" onclick="selectDate(1);">日</button>
		                            <button class="btn btn-white" id="week" type="button" onclick="selectDate(2);">周</button>
		                            <button class="btn btn-white" id="month" type="button" onclick="selectDate(3);">月</button>
		                            <button class="btn btn-white" id="year" type="button" onclick="selectDate(4);">年</button>
		                        </div>
		                        <div class="col-sm-5" id="storeStyle"></div>
		                        <div class="col-sm-3" id="detailStyle" style="display:none;"></div>
		                          <label class="col-sm-1 control-label" style="margin-top:10px;">二维码类别</label>
		                        <div class="col-sm-2">                     
			                        <select class="form-group form-control" id="search_code_type">
												<option value="0">自定义链接</option>
												<option value="1">H5活动</option>
									</select>
								</div>
								<div id="bindStyle" style="display:none;">
									  <label class="col-sm-1 control-label" style="margin-top:10px;">绑定类型</label>
									<div class="col-sm-1" >                     
				                        <select class="form-group form-control" id="search_bind_type">
													<option value="2">员工</option>
													<option value="1">渠道</option>
										</select>
									</div>
								</div>
					     	</div>
					    </div>
					    <div class="row" id="urlTableStyle">
					    	<div class="form-group">
								<div class="col-sm-12">
									<table class="table table-bordered" id="urlTable" style="width:100%;">
										<thead>
										 <tr>
											<th>排序</th>
											<th id="table_name_url">门店</th>
											<th><span name="select_date">今日</span>扫码次数</th>
											<th><span name="select_date">今日</span>扫码人数</th>
											<th>操作</th>
										 </tr>
										</thead>
										<tbody>
										</tbody>
									</table>
								</div>
							</div>
					    </div>
					    <div class="row" id="activityTableStyle" style="display:none;">
					    	<div class="form-group">
								<div class="col-sm-12">
									<table class="table table-bordered" id="activityTable" style="width:100%;">
										<thead>
										 <tr>
											<th>排序</th>
											<th id="table_name_activity">门店</th>
											<th><span name="select_date">今日</span>扫码次数</th>
											<th><span name="select_date">今日</span>扫码人数</th>
											<th><span name="select_date">今日</span>转化数</th>
											<th><span name="select_date">今日</span>核销数</th>
											<th>操作</th>
										 </tr>
										</thead>
										<tbody>
										</tbody>
									</table>
								</div>
							</div>
					    </div>
					</div>
			 </div>
		</div>
	</div>
	
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/bootcdn/BootCDN/ajax/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="<%=path %>/hplus/js/content.min.js?v=1.0.0"></script>
    <script src="<%=path %>/hplus/js/plugins/chosen/chosen.jquery.js"></script>
    <script src="<%=path %>/hplus/js/plugins/jsKnob/jquery.knob.js"></script>
    <script src="<%=path %>/hplus/js/plugins/jasny/jasny-bootstrap.min.js"></script>
    <script src="<%=path %>/hplus/js/plugins/datapicker/bootstrap-datepicker.js"></script>
    <script src="<%=path %>/hplus/js/plugins/prettyfile/bootstrap-prettyfile.js"></script>
    <script src="<%=path %>/hplus/js/plugins/nouslider/jquery.nouislider.min.js"></script>
    <script src="<%=path %>/hplus/js/plugins/switchery/switchery.js"></script>
    <script src="<%=path %>/hplus/js/plugins/ionRangeSlider/ion.rangeSlider.min.js"></script>
    <script src="<%=path %>/hplus/js/plugins/iCheck/icheck.min.js"></script>
    <script src="<%=path %>/hplus/js/plugins/metisMenu/jquery.metisMenu.js"></script>
    <script src="<%=path %>/hplus/js/plugins/colorpicker/bootstrap-colorpicker.min.js"></script>
    <script src="<%=path %>/hplus/js/plugins/clockpicker/clockpicker.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/3.6.1/echarts.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.16/js/jquery.dataTables.min.js"></script>
	<script src="<%=path%>/hplus/js/plugins/suggest/bootstrap-suggest.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
    <script src="<%=path%>/hplus/js/plugins/sweetalert/sweetalert2.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/artDialog/7.0.0/dialog-plus.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.2/bootstrap3-typeahead.min.js"></script>
  	<script type="text/javascript">
 	var path = "<%=path%>";
  	var storeNames={};
  	var users={};
  	var storeId;
  	$.fn.dataTable.ext.errMode = 'none';
	$("#store_name").typeahead({
		//数据源
		source:function(query,process){
		var getNameUrl=path+"/store/findListByDto";
			$.post(getNameUrl,{"likeName":query},function (data){
				//console.log(data.data[0].name);
				data=data.data;
				if(data!=null){
					var results = [];
	               for (var i = 0; i < data.length; i++) {
	               	storeNames[data[i].name] = data[i].id;
	                   results.push(data[i].name);
	               }
	               process(results);
				}else{
					console.log("没有查询到信息");
				}
			});
		},
		items:8,//最多显示8条
	  	//delay: 500,//延迟时间
	      //选择项之后的事件，item是当前选中的选项
	      afterSelect: function (item) { 
	      	$("#store_id").val(storeNames[item]);
	      }
	});
/* 	var getNameUrl=path+"/account/findUsersByStoreId";
	$.ajax({
			type:"post",
			url:getNameUrl,
			async: false,
			data:{
        	"storeId":storeId},
        success:function(data){
        	//console.log(data);
        	data=data.data;
			if(data!=null){
				for (var i = 0; i < data.length; i++) {
					  if(data[i]!=null){
		               	   users[data[i].name+":"+data[i].account] = data[i].id;
		                   usersName[i]=(data[i].name+":"+data[i].account); 
					  }
	               }
				console.log(users);
				console.log(usersName);
			}else{
				 users={};
				 usersName=[];
			}
       	 }
			}); */
  	$("#user_name").typeahead({
  		//数据源
		source:function(query,process){
		var getNameUrl=path+"/account/findUsersByStoreId";
			$.post(getNameUrl,{"name":query,"storeId":storeId},function (data){
				//console.log(data.data[0].name);
				data=data.data;
				if(data!=null){
					var usersName = [];
	               for (var i = 0; i < data.length; i++) {
	            	   if(data[i]!=null){
		               	   users[data[i].name+":"+data[i].account] = data[i].id;
		                   usersName[i]=(data[i].name+":"+data[i].account); 
					  }
	               }
	               process(usersName);
				}else{
					console.log("没有查询到信息");
				}
			});
		},
		items:8,//最多显示8条
	  	//delay: 500,//延迟时间
	      //选择项之后的事件，item是当前选中的选项
	      afterSelect: function (item) { 
	      	$("#user_id").val(users[item]);
	      }
	});
  	$("#activity_name").click(function(){
  		func_showActivityDetailDialog();
  	});
  	$("#close").click(function(){
		location.href=path+"/view/ui/mainView?menuId=100000073&menuName=营销管理&account=15810355456" ;
  	})
  	$("#commit").click(function(){
 		 var codeType=$('input:radio[name="code_type"]:checked').val();
 		 var bindType=$("#bind_type").val();
 		 var storeId=$("#store_id").val();
 		 var linkUrl=null;
 		 var bindInfo=null;
 		 var flag=true;
 		 if(codeType=="1"){
 			linkUrl=$("#activity_url").val();
 		 }else if(codeType=="0"){
 			 linkUrl=$("#link_url").val();
 		 }	
 		 if(bindType=="1"){
 			 bindInfo=$("#channel_info").val();
 		 }else if(bindType=="2"){
 			 if($('input:radio[name="bind_info"]:checked').val()=="0"){
 				bindInfo="all";
 			 }else if($('input:radio[name="bind_info"]:checked').val()=="1"){
 				 bindInfo=$("#user_id").val();
 			 }
 		 }
 		if(flag&&(linkUrl==""||typeof(linkUrl)=="undefined")){
			 flag=false;
			 if(codeType=="0"){
	 			func_artdialog("提示","请填写链接地址");
			 }else{
 	 			func_artdialog("提示","请选择活动");
			 }
		 }
 		if(flag&&codeType=="0"&&!urlvilidate(linkUrl)){			
 			flag=false;
 			func_artdialog("提示","网址请以http开头");
 		}
 		if(flag&&(storeId==null||storeId==""||typeof(storeId)=="undefined")){
			 flag=false;
			 func_artdialog("提示","请选择门店");
		 }		 
 		 if(flag&&bindType!="0"&&(bindInfo==""||typeof(bindInfo)=="undefined")){
 			 flag=false;
 			 if(bindType=="1"){
 				func_artdialog("提示","请填写绑定渠道信息");
 			 }else{
 				func_artdialog("提示","请填写绑定员工信息");
 			 }
 		 }		 
 		 var addUrl=path+"/qrCode/ajaxAddSocialQrcodeInfo";
 		 if(flag){
 			$.ajax({
 	 			type:"post",
 	  			url:addUrl,
 	  			async: false,
 	  			data:{
 	            	"storeId":storeId,
 	            	"codeType":codeType,
 	            	"bindType":bindType,
 	            	"bindInfo":bindInfo,
 	            	"linkUrl":linkUrl
 	            	},
 	            success:function(data){
 	            	if(data.status == 200){
 	            		window.location.reload();
 	            	}else{
 	            		func_artdialog("提示",data.message);
 	            	}
 	            }
 	 		 })
 		 }
 		 
  	});
  	 //判断网址
    function urlvilidate(url){
        var Expression=/^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)(([A-Za-z0-9-~]+)\.)+([A-Za-z0-9-~\/])+$/;
        //var regZuoj = /^(\d{2,4}-?)?\d{7,8}$/;
        var result = Expression.test(url);
        if(!result){
            return false;
        }else{
            return true;
        }
    }
  	$("input[name='code_type']").click(function(){
  		 var codeType=$('input:radio[name="code_type"]:checked').val();
  		 if(codeType=="0"){
  			 $("#show_linkUrl").attr("style","margin-top:10px;display:block;");
  			 $("#show_activity").attr("style","margin-top:10px;display:none;");
  		 }else if(codeType=="1"){
  			$("#show_linkUrl").attr("style","margin-top:10px;display:none;");
 			 $("#show_activity").attr("style","margin-top:10px;display:block;");
  		 }
  	});
  	$("#bind_type").change(function(){
  		var bindType=$("#bind_type").val();
  		var storeId=$("#store_id").val();
  		if(storeId==null||typeof(storeId)=="undefined"||storeId==""){
			func_artdialog("提示","请先选择门店！");
			$('#bind_type').prop('selectedIndex', 0);
		}
  		else if(bindType=="0"){
  			$("#channel").attr("style","display:none;");
  			$("#user").attr("style","display:none;");
  		}else if(bindType=="1"){
  			$("#channel").attr("style","display:block;");
  			$("#user").attr("style","display:none;");
  		}else if(bindType=="2"){
  			$("#channel").attr("style","display:none;");
  	  		$("#user").attr("style","display:block;");
  			}  			
  	});
  	$("input[name='bind_info']").click(function(){ 
  		 var bindInfo=$('input:radio[name="bind_info"]:checked').val();
  		 if(bindInfo=="0"){
  			 $("#user_name").attr("style","min-width: 100px; display:none;");
  		 }else if(bindInfo=="1"){
  			storeId=$("#store_id").val();
  			$("#user_name").attr("style","min-width: 100px; display:block;");
  		 }
  	});
  	//自定义弹框
  	function func_artdialog(name,value){
 		var d = dialog({
 			title: name,
 			fixed: true,
 			width: 200,
 	        height:100,
 			content:"<center style='font-size:20px; line-height:100px;'>"+value+"</center>",
 			okValue: "确定",
 			ok: function () {
 				return true;
 			}
 		});
 		d.show();
 	}
  	function func_showActivityDetailDialog(){
  		activityDetailDialog=dialog({
  			id: "activityDialog",
  	        fixed: true,
  	        width: 600,
  	        height: 360,
  	        title: '选择活动',
  	        url: path+"/view/ui/showActivity",
  	        cancel: false,
  	        cancelValue: "关闭"
  		});
  		activityDetailDialog.showModal();
  		$("iframe[name='activityDetailDialog']:visible").attr("scrolling", "auto").css("overflow-x", "hidden").css("overflow-y", "auto");
  	}
/*****************************************     管理        *****************************************/
	var date=1;
	var storeId=null;
	var codeType=0;
	var bindType=2;
  	var urlTable;
  	var activityTable;
	function selectDate(data){
  		if(data=="1"){
  			$("span[name='select_date']").html("今日");
  			$("#day").attr("class","btn btn-primary");
  			$("#week").attr("class","btn btn-white");
  			$("#month").attr("class","btn btn-white");
  			$("#year").attr("class","btn btn-white");
  		}else if(data=="2"){
  			$("span[name='select_date']").html("本周");
  			$("#day").attr("class","btn btn-white");
  			$("#week").attr("class","btn btn-primary");
  			$("#month").attr("class","btn btn-white");
  			$("#year").attr("class","btn btn-white");
  		}else if(data=="3"){
  			$("span[name='select_date']").html("本月");
  			$("#day").attr("class","btn btn-white");
  			$("#week").attr("class","btn btn-white");
  			$("#month").attr("class","btn btn-primary");
  			$("#year").attr("class","btn btn-white");
  		}else if(data=="4"){
  			$("span[name='select_date']").html("今年");
  			$("#day").attr("class","btn btn-white");
  			$("#week").attr("class","btn btn-white");
  			$("#month").attr("class","btn btn-white");
  			$("#year").attr("class","btn btn-primary");
  		}
  		date=data;
  		reloadTables();
  	}
	$(function(){
		urlTable=urlDataTable();
		activityTable=activityDataTable();
	})
	function init_tables(){
		reloadTables();
	}
	function detailDataTable(data){
		//名称修改
		$("#table_name_activity").html("员工");
		$("#table_name_url").html("员工");
		$("#storeStyle").attr("style","display:none;");
		$("#detailStyle").attr("style","display:block;");
		$("#bindStyle").attr("style","display:block;");
		storeId=data;
		reloadTables();
	}
 	$("#search_code_type").change(function(){
 		if($("#search_code_type").val()==1){
 			codeType=1;
 			$("#urlTableStyle").attr("style","display:none;");
 			$("#activityTableStyle").attr("style","display:block;");
 		}else{
 			codeType=0;
 			$("#urlTableStyle").attr("style","display:block;");
 			$("#activityTableStyle").attr("style","display:none;");
 		}
		reloadTables();
	}); 
	$("#search_bind_type").change(function(){
		
		if($("#search_bind_type").val()==1){
			$("#table_name_url").html("渠道");
			$("#table_name_activity").html("渠道");
			bindType=1;
		}else{
			$("#table_name_url").html("员工");
			$("#table_name_activity").html("员工");
			bindType=2;
		}
		reloadTables();
	})
 	function reloadTables(){	
		if(codeType==1){
			activityTable.ajax.reload();
		}else{
			urlTable.ajax.reload();
		} 		
 	}
	function show_all_count(data){
		var showCountUrl=path+"/view/qrcode/qrCount?storeId="+data+"&codeType="+codeType;
		window.location.href=showCountUrl;
	}
 	function show_count(data){
		var showCountUrl=path+"/view/qrcode/qrCount?codeId="+data+"&codeType="+codeType;
		window.location.href=showCountUrl;
 	}
	function show_qrcode(data){
		var d = dialog({
			width: 120,
 	        height:140,
 	        align: 'bottom',
 			content:"<div id='code'></div> <img src='' id='qrcodeImg' style='width:110px;height:110px;'/>"+
 	        "<a id='download' download='qrcode.jpg'></a>"+
 	        "<button type='button' class=' btn btn-primary k_verify' id='save' style='margin-top:8px;width:100px;height:30px;cursor: pointer;'>下载二维码</button>",
			quickClose: true// 点击空白处快速关闭
		});
		d.show(document.getElementById('showCode'+data));
 		createQRCode("code",data,100,50,null);
 		$("#save").click(function(){  
 			donwload_qrcode(data);
 	    })
	}
	function donwload_qrcode(url){
		  var option="<div id='maxImg' class='gray-bg' style='cursor: pointer;margin-top:50px; float:left;width:200px;height:100px;'><img src='"+path+"/images/sign-down-icon.png' style='float:left;margin-top:30px;margin-left:30px;width:40px;height:40px;'><div style='padding-top:30px;margin-left:80px;'><h3>大尺寸</h3><p>1000*1000像素</p></div></div>";
		  option+="<div id='mediumImg' class='gray-bg' style='cursor: pointer;margin-left:40px;margin-top:50px;float:left; width:200px;height:100px;'><img src='"+path+"/images/sign-down-icon.png' style='float:left;margin-top:30px;margin-left:30px;width:40px;height:40px;'><div style='padding-top:30px;margin-left:80px;'><h3>中等尺寸</h3><p>500*500像素</p></div></div>";
		  option+="<div id='minImg' class='gray-bg' style='cursor: pointer;margin-left:40px;margin-top:50px;float:left;width:200px;height:100px;'><img src='"+path+"/images/sign-down-icon.png' style='float:left;margin-top:30px;margin-left:30px;width:40px;height:40px;'><div style='padding-top:30px;margin-left:80px;'><h3>小尺寸</h3><p>300*300像素</p></div></div>";
		  var d = dialog({
			title: "下载二维码",
			fixed: true,
			width: 700,
	        height:200,
			content:option
		});	
		d.showModal();  
		$("#maxImg").click(function(){
			downloadClick(1000,1000,url);
		});
		$("#mediumImg").click(function(){
			downloadClick(500,500,url);
		});
		$("#minImg").click(function(){
			downloadClick(300,300,url);
		});
	}
	  //jquery
	   function downloadClick (w,h,data) {
	   $('#code').empty();
	   var url=$("#showCode"+data).attr("data-url"+data);
	   var qrcode = $('#code').qrcode({
   		   width: w,
   		   height:h,
           text: url+""/*可以通过ajax请求动态设置*/
       	 }).hide();
         //将生成的二维码转换成图片格式
       	var canvas = qrcode.find('canvas').get(0);
	    // 构造url
	    url = canvas.toDataURL('image/png');
	    // 构造a标签并模拟点击
	    var downloadLink = document.getElementById('download');
	    downloadLink.setAttribute('href', url);
	    downloadLink.click();
	  } 
	function exportCanvasAsPNG(canvas, fileName) {              
        var MIME_TYPE = "image/png";  
        var dlLink = document.createElement('a');  
        dlLink.download = fileName;
        dlLink.href = canvas.toDataURL("image/png");  
        dlLink.dataset.downloadurl = [MIME_TYPE, dlLink.href].join(':');  
        document.body.appendChild(dlLink);  
        dlLink.click();  
        document.body.removeChild(dlLink);  
    }	
	
	 //创建二维码
    function createQRCode(id, data, w, h, src){
    	$('#code').empty();
    	var url=$("#showCode"+data).attr("data-url"+data);
    	 var qrcode = $('#code').qrcode({
    		   width: 110,
    		   height:110,
               text:url+""/*可以通过ajax请求动态设置*/
        	 }).attr("style","display:none;");
         	//将生成的二维码转换成图片格式
        	  var canvas = qrcode.find('canvas').get(0);
        	  $('#qrcodeImg').attr('src', canvas.toDataURL('image/jpg'));
	 
    }
	function delete_all_code(data){
		var deleteUrl=path+"/qrCode/ajaxDeleteQrcodeByStoreId";
		var d = dialog({
 			title: "提示",
 			fixed: true,
 			width: 200,
 	        height:100,
 			content:"<center style='font-size:20px; line-height:100px;'>你确定要删除吗？</center>",
 			cancel: true,
  	        cancelValue: "取消",
 			okValue: "确定",
 			ok: function () {
 				$.post(deleteUrl,{
 		        	"storeId":data,
 		        	"codeType":codeType},
 		        	function(data){
 		        		if(data.status == 200){
 		        			func_artdialog("提示","删除成功！");
 		        			reloadTables();
 		        		}
 		        	});
 				return true;
 			}
 		});
 		d.show();
		
	}
	function delete_code(data){
		var deleteUrl=path+"/qrCode/ajaxDelelteQrcode";
		var d = dialog({
 			title: "提示",
 			fixed: true,
 			width: 200,
 	        height:100,
 			content:"<center style='font-size:20px; line-height:100px;'>你确定要删除吗？</center>",
 			cancel: true,
  	        cancelValue: "取消",
 			okValue: "确定",
 			ok: function () {
			$.post(deleteUrl,{
	        	"id":data},
	        	function(data){
	        		if(data.status == 200){
	        			func_artdialog("提示","删除成功！");
	        			reloadTables();
	        		}
	        	});
 			}
 		});
		d.show();
	}
	 function urlDataTable(){
     	return $('#urlTable').DataTable({
     		processing: true,
     		//ordering: false,
     		searching: false,
     		info: true,
     		autoWidth: true,
     		lengthChange: false,
     		"order": [[ 2, "desc" ]],
     	    language: {
     	    	emptyTable: '<div id="content_empty"  class="form-group white-bg" style="text-align:center;padding:200px 0;margin:0;">   <p>暂无点击数据</p></div>',
     	    	info: '从第 _START_ 到第 _END_ 条数据；总共有 _TOTAL_ 条记录',
     			infoEmpty: '没有数据',
     			lengthMenu: '每页显示 _MENU_ 条记录',
     			loadingRecords: '正在加载数据....',
     			processing: '正在处理数据....',
     			zeroRecords: '没有找到匹配的记录',
     			paginate: {
     				first: '首页',
     				previous: '前页',
     				next: '后页',
     				last: '尾页'
     			}
     	    },
     	    order: [[2,'desc']],
     		pageLength: 6,
     	    pagingType: 'full_numbers',        	     
     	    columns: func_columns(),
     	     columnDefs: [{
	    	　　　　'targets' : [0,1,4],    //除2.3两列外，都默认不排序
	    	　　　　'orderable' : false
	    	　　},{
     	    	render: function(data, type, full) {
     	    	var innerHtml="";
     	    	if(storeId==null){
 				innerHtml+="<a href='javaScript:void(0);'onclick='detailDataTable(\""+full.storeId+"\")'>";
 				innerHtml+=""+full.name+"</a>";
     	    	}else{
     	    		innerHtml+=full.name;
     	    	}
				return innerHtml;
            },
			targets: 1
     		},{
     	    	render: function(data, type, full) {
         	    	var innerHtml="";
         	    	if(storeId!=null){
         	    		innerHtml+="<a style='margin-left:20px;font-size:16px;' href='javaScript:void(0);' id='showCode"+data.id+"' data-url"+data.id+"='"+data.url+"' onclick='show_qrcode(\""+data.id+"\")'>二维码</a>";
         	    		innerHtml+="<a style='margin-left:20px;font-size:16px;' href='javaScript:void(0);'onclick='show_count(\""+data.id+"\")'>统计</a>";
         	    		 <shiro:hasPermission name="qrcode_markting_mamage:delete_qrcode">
        	    		innerHtml+="<a style='margin-left:20px;font-size:16px;' href='javaScript:void(0);'onclick='delete_code(\""+data.id+"\")'>删除</a>"; 	
        	    		</shiro:hasPermission>
					}else{
						innerHtml+="<a style='margin-left:20px;font-size:16px;' href='javaScript:void(0);'onclick='show_all_count(\""+full.storeId+"\")'>统计</a>";
						 <shiro:hasPermission name="qrcode_markting_mamage:delete_store">
        	    		innerHtml+="<a style='margin-left:20px;font-size:16px;' href='javaScript:void(0);'onclick='delete_all_code(\""+full.storeId+"\")'>删除</a>";
        	    		</shiro:hasPermission>
         	    	}         	    	
    				return innerHtml;
     	    	},  
    			targets: 4
         		}],  
     	    serverSide: true,
     	    ajax: {
     	    	contentType: 'application/json',
     	    	type: 'POST',
     	    	url: func_AjaxUrl(),
     	    	data: function(d){
     				d.extra_search = func_ajaxData();
     				return JSON.stringify(d);
     	    	}	
     	    }
     	});
     	 function func_AjaxUrl(){
          	return path+"/qrCode/ajaxGetAllBrowseByUrl";
          }
     	 /**
     	  *	后台查询条件
     	  */
     	 function func_ajaxData(){
     		var jsonObject = new Object();
      		 jsonObject.date=date;
      		 jsonObject.codeType=codeType;
      		 jsonObject.storeId=storeId;
      		 jsonObject.bindType=bindType;
   	 		return jsonObject;
     	 }
          /**
           *	设置列名，对应后台
           */
          function func_columns(){
           	var jsonArr = [
        		{"data":"id"},
        		{"data":"storeInfo"},
        		{"data":"clickCount"},
        		{"data":"clickMemberCount"},
        		{"data":"codeInfo"}];
          	return jsonArr;
          }
     }
	 function activityDataTable(){
	     	return $('#activityTable').DataTable({
	     		processing: true,
	     		//ordering: false,
	     		searching: false,
	     		info: true,
	     		autoWidth: true,
	     		lengthChange: false,
	     		"order": [[ 2, "desc" ]],
	     	    language: {
	     	    	emptyTable: '<div id="content_empty"  class="form-group white-bg" style="text-align:center;padding:200px 0;margin:0;">   <p>暂无点击数据</p></div>',
	     	    	info: '从第 _START_ 到第 _END_ 条数据；总共有 _TOTAL_ 条记录',
	     			infoEmpty: '没有数据',
	     			lengthMenu: '每页显示 _MENU_ 条记录',
	     			loadingRecords: '正在加载数据....',
	     			processing: '正在处理数据....',
	     			zeroRecords: '没有找到匹配的记录',
	     			paginate: {
	     				first: '首页',
	     				previous: '前页',
	     				next: '后页',
	     				last: '尾页'
	     			}
	     	    },
	     	    order: [[1,'desc']],
	     		pageLength: 6,
	     	    pagingType: 'full_numbers',        	     
	     	    columns: func_columns(),
	     	     columnDefs: [{
	 	    	　　　　'targets' : [0,1,4,5,6],    //除2.3两列外，都默认不排序
		    	　　　　'orderable' : false
		    	　　},{
	     	    	render: function(data, type, full) {
	     	    	var innerHtml="";
					if(storeId==null){
		 				innerHtml+="<a href='javaScript:void(0);'onclick='detailDataTable(\""+full.storeId+"\")'>";
		 				innerHtml+=""+full.name+"</a>";
		     	    	}else{
		     	    		innerHtml+=full.name;
		     	    	}
						return innerHtml;
	            },
				targets: 1
	     		},{
	     	    	render: function(data, type, full) {
	         	    	var innerHtml="";
	         	    	if(storeId!=null){
	         	    		innerHtml+="<a style='margin-left:20px;font-size:16px;' href='javaScript:void(0);' id='showCode"+data.id+"' data-url"+data.id+"='"+data.url+"' onclick='show_qrcode(\""+data.id+"\")'>二维码</a>";
	         	    		innerHtml+="<a style='margin-left:20px;font-size:16px;' href='javaScript:void(0);'onclick='show_count(\""+data.id+"\")'>统计</a>";
	         	    		 <shiro:hasPermission name="qrcode_markting_mamage:delete_qrcode">
	         	    		innerHtml+="<a style='margin-left:20px;font-size:16px;' href='javaScript:void(0);'onclick='delete_code(\""+data.id+"\")'>删除</a>"; 	
	         	    		</shiro:hasPermission>
	         	    	}else{         	    		
							innerHtml+="<a style='margin-left:20px;font-size:16px;' href='javaScript:void(0);'onclick='show_all_count(\""+full.storeId+"\")'>统计</a>";
							 <shiro:hasPermission name="qrcode_markting_mamage:delete_store">
	        	    		innerHtml+="<a style='margin-left:20px;font-size:16px;' href='javaScript:void(0);'onclick='delete_all_code(\""+full.storeId+"\")'>删除</a>";
	        	    		</shiro:hasPermission>
	         	    	}   
	    				return innerHtml;
	     	    	},  
	    			targets: 6
	         		}],  
	     	    serverSide: true,
	     	    ajax: {
	     	    	contentType: 'application/json',
	     	    	type: 'POST',
	     	    	url: func_AjaxUrl(),
	     	    	data: function(d){
	     				d.extra_search = func_ajaxData();
	     				return JSON.stringify(d);
	     	    	}	
	     	    }
	     	});
	     	 function func_AjaxUrl(){
	          	return path+"/qrCode/ajaxGetAllBrowseByUrl";
	          }
	     	 /**
	     	  *	后台查询条件
	     	  */
	     	 function func_ajaxData(){
	     		var jsonObject = new Object();
	      		 jsonObject.date=date;
	      		 jsonObject.codeType=codeType;
	      		 jsonObject.storeId=storeId;
	      		 jsonObject.bindType=bindType;
	   	 		return jsonObject;
	     	 }
	          /**
	           *	设置列名，对应后台
	           */
	          function func_columns(){
	           	var jsonArr = [
	        		{"data":"id"},
	        		{"data":"storeInfo"},
	        		{"data":"clickCount"},
	        		{"data":"clickMemberCount"},
	        		{"data":"changeCount"},
	        		{"data":"cancelCount"},
	        		{"data":"codeInfo"}];
	          	return jsonArr;
	          }
	     }
  </script>
</body>
</html>
